<!-- In this file, I made adjustment to make opening page more proper. In my opinion, working with long horizontal tables is logical idea -->
<!-- For each paragraph and picture, I added  a horizontal table-->
<%@page import="java.util.*,java.text.*"%>
<%@page import="QRCG.DatabaseManager"%>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>View and Search Games</title>
<link href="index.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="jquery.accordion.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
		jQuery('#list1b').accordion({
			autoheight : false
		});
		jQuery('#list2b').accordion({
			autoheight : false
		});
		jQuery('#list3b').accordion({
			autoheight : false
		});
	});
</script>
<script language="javascript">
	function popup(url) {
		var win_dow = window.open(url, 'myPopUp',
				"type=fullWindow, fullscreen,scrollbars=yes");
	}
</script>
</head>

<%@ include file="header.jsp"%>

<%
	if (session.getAttribute("nickname") != null) {

		ArrayList<HashMap<String, Object>> games = new ArrayList<HashMap<String, Object>>();

		final int DESC_LIMIT = 250; //the char limit of the description shown to the user in the sidebars
		final int GAME_LIMIT = 5;

		String gameinfo = "";
		String url = "";
		String desc = "";
		String game_status = ""; //not started yet/started/finished/
		String winner = ""; //nickname of the game winner if the game has finished, - elsewhere
		DatabaseManager connection = new DatabaseManager();
		connection.connect();

		String user_id = (String) session.getAttribute("user_id");
		DateFormat readable = new SimpleDateFormat("dd-MM-yyyy");
		
		DateFormat df = new SimpleDateFormat("yyyy-MM-dd");
		String today = df.format(new Date());

		String bdate, edate; //begin and end dates of the games

		String searched = (String) session.getAttribute("searchedB"); //if no search is done, this value is null
%>

<div id="page">
	<div id="page-bgtop">
		<div id="page-bgbtm">
			<div id="search-content">
				<!-- Write the search query here -->

				<div id="navbar">

					<form action="SearchGamesServlet" method="post">

						<div id="nb_search">

							<button id="navbar-submit-button" class="primary btn"
								type="submit" value="Search">
								<div class="magnifyingglass"></div>
							</button>
							<input type="text" value="" name="searchParam" id="navbar-query"
								class="navbar-large"
								placeholder="Find Games by name, location, description...">
							<div class="quicksearch_dropdown_wrapper">

								<select class="quicksearch_dropdown" name="searchCateg"
									id="quicksearch"
									onchange="jumpMenu(this); suggestionsearch_dropdown_choice(this);">

									<option value="allgames">All Games</option>
									<option value="name">Game Name</option>
									<option value="location">Location</option>
									<option value="description">Description</option>

								</select>

							</div>


							<div id="navbar-suggestionsearch" class="navbar-large"></div>
						</div>

					</form>

				</div>

				<!-- <div style="clear: both;">&nbsp;</div>  -->

				<div id=content>

					<%
						if (searched != null) { //search is done
								games = (ArrayList<HashMap<String, Object>>) session
										.getAttribute("sgames");
								String scat = (String) session.getAttribute("scat");
								String sparam = (String) session.getAttribute("sparam");
					%>
					<p>
						Search Results: <b><i><%=scat%>, <%=sparam%></i></b>
					</p>

					<%
						} else {//no search is done

								games = connection.getAllGames();
					%>
					<p>All Games:</p>

					<%
						}

							if (!games.isEmpty()) {
					%>

					<div class="gameinf">
						<div class="entry">
							<p>NAME</p>
						</div>
					</div>

					<div class="gameinf">
						<div class="entry">
							<p>LOCATION</p>
						</div>
					</div>
					<div class="gameinf">
						<div class="entry">
							<p>START DATE</p>
						</div>
					</div>

					<div class="gameinf">
						<div class="entry">
							<p>END DATE</p>
						</div>
					</div>

					<div class="gameinf">
						<div class="entry">
							<p>STATUS</p>
						</div>
					</div>
					
					<div class="gameinf">
						<div class="entry">
							<p>WINNER</p>
						</div>
					</div>

					<%
						for (int i = 0; i < games.size(); i++) {
									HashMap<String, Object> map2 = (HashMap<String, Object>) games
											.get(i);
									bdate = readable.format(map2.get("begin_date"));
									edate = readable.format(map2.get("end_date"));

									url = "ViewTheGame.jsp?game_id=" + map2.get("game_id");
									winner = "Pending..";
									
									if(today.compareTo(df.format(map2.get("begin_date")))<0) //the game has not started yet
									{
										game_status = "Pending";
									}
									else if(today.compareTo(df.format(map2.get("end_date")))>0) //the game has finished
									{
										game_status = "Finished";
										winner = connection.get_nicknamefrom_id(connection.gameWinner((Integer)map2.get("game_id")));
										if(winner == null)
											winner = "No winner";
									}
									else //the game is ongoing
										game_status = "Started";
										
									
					%>

					<div class="gameinf">
						<div class="entry">
							<a href=<%=url%>> <%=map2.get("name")%>
							</a>
						</div>
					</div>

					<div class="gameinf">
						<div class="entry">
							<p>
								<%=connection.getGameInformation(
								DatabaseManager.GameInformation.LOCATION, map2
										.get("game_id").toString())%>
							</p>
						</div>
					</div>
					<div class="gameinf">
						<div class="entry">
							<p>
								<%=bdate%>
							</p>
						</div>
					</div>

					<div class="gameinf">
						<div class="entry">
							<p>
								<%=edate%>
							</p>
						</div>
					</div>
					
					<div class="gameinf">
						<div class="entry">
							<p>
								<%=game_status%>
							</p>
						</div>
					</div>

					<div class="gameinf">
						<div class="entry">
							<p>
								<%=winner%>
							</p>
						</div>
					</div>
						
					<%
						}
							} else {
					%>
					<div class="gameinf">
						<div class="entry">
							<p>No games found!</p>
						</div>
					</div>
					<%
						}
					%>
				</div>


			</div>
			<!-- end #content -->


			<div id="sidebar">
				<ul>
					<li>
						<div style="clear: both;">&nbsp;</div>
					</li>
					<li>
						<h2>TOP ONGOING GAMES</h2>
					</li>

					<li>
						<div class="basic" id="list1b">

							<%
								games = connection.getSortedGames("rating", today, GAME_LIMIT);

									if (!games.isEmpty()) {
										for (int i = 0; i < games.size(); i++) {
											HashMap<String, Object> map1 = (HashMap<String, Object>) games
													.get(i);

											url = "ViewTheGame.jsp?game_id=" + map1.get("game_id");

											gameinfo = "Location: "
													+ connection
															.getGameInformation(
																	DatabaseManager.GameInformation.LOCATION,
																	map1.get("game_id").toString());

											desc = (String) map1.get("description");

											if (desc.length() > DESC_LIMIT) {
												desc = desc.substring(0, DESC_LIMIT);
												desc += "...";
											}

											gameinfo += "<br>Description: " + desc;
							%>
							<a><%=map1.get("name")%></a>
							<div>
								<p><%=gameinfo%></p>
								<p style="cursor: pointer; color: #D14836;"
									onclick="javascript:popup('<%=url%>')">Click here for more
									information</p>
							</div>

							<%
								}
									}
							%>
						</div>
					</li>
				</ul>
			</div>
			<!-- end #sidebar -->

			<!-- REGISTERED GAMES -->
			<div id="sidebar">
				<ul>
					<li>
						<div style="clear: both;">&nbsp;</div>
					</li>
					<li>
						<h2>REGISTERED GAMES</h2>
					</li>

					<li>
						<div class="basic" id="list2b">

							<%
								games = connection.getUserGames(user_id, GAME_LIMIT);

									if (!games.isEmpty()) {
										for (int i = 0; i < games.size(); i++) {
											HashMap<String, Object> map1 = (HashMap<String, Object>) games
													.get(i);

											url = "ViewTheGame.jsp?game_id=" + map1.get("game_id");

											gameinfo = "Location: "
													+ connection
															.getGameInformation(
																	DatabaseManager.GameInformation.LOCATION,
																	map1.get("game_id").toString());

											desc = (String) map1.get("description");

											if (desc.length() > DESC_LIMIT) {
												desc = desc.substring(0, DESC_LIMIT);
												desc += "...";
											}

											gameinfo += "<br>Description: " + desc;
							%>
							<a><%=map1.get("name")%></a>
							<div>
								<p><%=gameinfo%></p>
								<p style="cursor: pointer; color: #D14836;"
									onclick="javascript:popup('<%=url%>')">Click here for more
									information</p>
							</div>

							<%
								}
									} else {
							%>
							<div>
								<p>
									<font color=#D14836>You haven't registered to any games
										yet!</font>
								</p>
							</div>
							<%
								}
							%>

						</div>
					</li>
				</ul>
			</div>
			<!-- end #sidebar Registered Games -->

			<!-- CREATED GAMES -->
			<div id="sidebar">
				<ul>
					<li>
						<div style="clear: both;">&nbsp;</div>
					</li>
					<li>
						<h2>CREATED GAMES</h2>
					</li>

					<li>
						<div class="basic" id="list3b">

							<%
								games = connection.getCreatedGames(user_id, GAME_LIMIT);

									if (!games.isEmpty()) {
										for (int i = 0; i < games.size(); i++) {
											HashMap<String, Object> map1 = (HashMap<String, Object>) games
													.get(i);

											url = "ViewTheGame.jsp?game_id=" + map1.get("game_id");

											gameinfo = "Location: "
													+ connection
															.getGameInformation(
																	DatabaseManager.GameInformation.LOCATION,
																	map1.get("game_id").toString());

											desc = (String) map1.get("description");
											if (desc.length() > DESC_LIMIT) {
												desc += "...";
											}

											gameinfo += "<br>Description: " + desc;
							%>
							<a><%=map1.get("name")%></a>
							<div>
								<p><%=gameinfo%></p>
								<p style="cursor: pointer; color: #D14836;"
									onclick="javascript:popup('<%=url%>')">Click here for more
									information</p>
							</div>

							<%
								}
									} else {
							%>
							<div>
								<p>
									<font color=#D14836>You haven't created any games yet!</font>
								</p>
							</div>
							<%
								}
							%>
						</div>
					</li>
				</ul>
			</div>
			<!-- end #sidebar Created Games -->



			<div style="clear: both;">&nbsp;</div>
		</div>
	</div>
</div>
<%
	} else {
		response.sendRedirect("index.jsp");
	}
%>

<!-- end #page -->
<%@ include file="footer.jsp"%>